import { report, qrCode } from "./request.js";
let data = {
    phone: sessionStorage.getItem('phone'),
    name: sessionStorage.getItem('name'),
}
// 获取内容盒子
let section = document.querySelector('.section');
//获取预约条数的盒子
let title = document.querySelector('.title');
let rightBox = title.querySelector('.right');
// 二维码盒子
let coverBox = document.querySelector('.coverBox');
let picture = coverBox.querySelector('.picture');
async function getData() {
    let res = await report(data);
    render(res.result);
    let codes = document.querySelectorAll('.code');
    //点击显示二维码
    codes.forEach(function (ele) {
        ele.addEventListener('click', async function () {
            picture.innerHTML = "";
            let data2 = {
                token: sessionStorage.getItem('token'),
                id: ele.getAttribute('code-id'),
            }
            let res2 = await qrCode(data2);
            let img = new Image();
            img.src = res2.data.data;
            picture.appendChild(img);
            coverBox.style.left = 0;
        })
    })
}
//隐藏二维码
coverBox.addEventListener('click', function () {
    coverBox.style.left = '-100%';
})
getData()
//根据返回值渲染页面
function render(arr) {
    //判断时间
    let nowTime = new Date().getTime();
    //初始化预约条数
    let num = 0;
    arr.forEach(function (ele) {
        let session = "";
        let selectTime = "";
        switch (ele.show_id) {
            case "1":
                session = "9:00-12:00";
                selectTime = new Date(ele.day_time + " 12:00:00").getTime();
                break;
            case "2":
                session = "12:00-14:30";
                selectTime = new Date(ele.day_time + " 14:30:00").getTime();
                break;
            case "3":
                session = "14:30-17:00";
                selectTime = new Date(ele.day_time + " 17:00:00").getTime();
                break;
        }
        //过滤过期预约,并渲染未完成预约
        if (nowTime < selectTime) {
            num++
            section.innerHTML += `
          <div class="content">
                <div class="show-qrCode">
                     <div class="overBox">
                     <div class="username">姓名:${ele.name}</div>
                     <div class="time">日期:${ele.day_time}</div>
                      <div class="session">场次:${session}</div>
                      </div>
                      <div class="code" code-id="${ele.id}">点击查看二维码</div>
                     <div class="qrCode"></div>
                </div>
            </div>
        `
        }

    })
    rightBox.innerHTML = `共 ${num} 条`;
    //如果预约条数为0，显示没有预约记录
    if (num == 0) {
        title.style.visibility = "hidden";
        section.innerHTML = `
        <div class="content" style="line-height:50.6vw">没有记录</div>
        `
    }

}

